import Vue from 'vue'
import VueRouter from 'vue-router'
import routes from './routes'
import store from '@/store'
Vue.use(VueRouter)
let oldPush = VueRouter.prototype.push
VueRouter.prototype.push = function (location, a = () => { }, b = () => { }) {
    oldPush.call(this, location, a, b)

}
const router = new VueRouter({
    mode: 'history',
    routes,

})
// 创建路由守卫,当访问指定页面时验证其的token
const whiteName = [
    "login",
    "home",
    "register",
    "search",
    "detail",
    "addCartSuccess",
];

router.beforeEach(async (to, from, next) => {
    let token = store.state.user.token
    if (token) {
        // 如果有token就全部放行
        // 如果拥有token,就需要去判断是否函含有用户信息,没有用户信息就需要去请求用户信息,用户信息作为全局数据需要存储在vuex中

        if (to.name === 'login') return next('/home') // 以及登录后不允许访问login页,访问就直接跳转回主页   
        const userInfo = store.state.user.userInfo
        if (Object.keys(userInfo).length === 0) {
            // userInfo中的键为0,代表没有用户信息.所以需要请求用户信息
            try {
                //调用store中的函数,生成并向vuex中写入数据
                await store.dispatch('user/setUserInfo')
                next()
            } catch (error) {
                // 当数据出现错误,代表token过期或者其他,就直接删除token,并将其跳到ligin页面
                await store.dispatch('user/removeToken_Local')
                next('/login')
            }
            // 向后端请求用户数据时,需要携带用户token,将用户token放置在请求头中,和TempId一样    
            // 对于用户信息,只需要请求一次即可,所以需要判断是否含有,如果含有就不再请求
            // 请求后跳转
            // 由于请求函数需要时间,这时不能进行跳转,而setuserinfo函数是一个async函数,返回一个promise对象,可以使用await实现等待

        } else {
            //如果不为空,代表已经有用户信息,就直接允许通过
            next()
        }



    } else {
        // 如果没有token就判断是否为白名单,如果不是白名单页面,就需要跳转到login页面,让用户去登录
        if (whiteName.includes(to.name)) {
            next()
        }
        else {
            next('/login')
        }
    }
    router.beforeResolve((_, __, next) => {
        window.scrollTo(0, 0)
        next()
    })
})
export default router